import 'dart:convert';

import 'package:center_beijing/common/styles.dart';
import 'package:center_beijing/models/selectItem.dart';
import 'package:flutter/material.dart';
import 'package:grouped_checkbox/grouped_checkbox.dart';

class CheckBoxWidget extends StatefulWidget {
  final String labelText;
  final String placeholder;
  final bool disabled;
  final bool ifRequired;
  final String icon;
  final Function selectCallback;
  final String rightText;
  final String fieldName;
  final bool bottomLine;
  final String defaultValue;
  final List<SelectItems> items;
  final wrap;

  CheckBoxWidget(
      {this.labelText = '',
      this.placeholder,
        this.wrap = Axis.horizontal,
      this.disabled,
        this.defaultValue,
        this.fieldName,
      this.ifRequired,
      this.icon = '',
      this.selectCallback,
      this.rightText = '',
      this.items,
      this.bottomLine = false});

  @override
  _CheckBoxWidgetState createState() => _CheckBoxWidgetState();
}

class _CheckBoxWidgetState extends State<CheckBoxWidget> {


  List<String> allItemList = [];
  List<String> checkedItemList = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    List<String> tem = [];
    List<String> temDefaultList = [];
    var defaultList = widget.defaultValue.replaceAll(' ', '').replaceAll('[', '').replaceAll(']', '').split(',');
    widget.items.forEach((item) {
      tem.add(item.label);
      if(defaultList.contains(item.value)){
        temDefaultList.add(item.label);
      }
    });
    this.setState(() {
      allItemList = tem;
      checkedItemList = temDefaultList;
    });

  }


  @override
  Widget build(BuildContext context) {
    return Container(
      color: Theme.of(context).cardColor,
      child: DecoratedBox(
        decoration: BoxDecoration(
            border: widget.bottomLine
                ? Border(
                bottom: BorderSide(color: Styles.LineColor, width: 1))
                : null),
        child: Padding(
          padding: EdgeInsets.fromLTRB(
              Styles.spacing16, Styles.spacing8, Styles.spacing16, Styles.spacing8),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Container(
                    child: Padding(
                      padding: EdgeInsets.only(right: 8),
                      child: Row(
                        children: <Widget>[
                          widget.ifRequired
                              ? Text(
                            "*",
                            style: TextStyle(
                                fontSize: Styles.NormalFont,
                                color:
                                Color.fromRGBO(242, 114, 94, 1)),
                          )
                              : Container(),
                          widget.icon != ''
                              ? Image(
                            image: AssetImage(widget.icon),
                            width: 20,
                            height: 20,
                            fit: BoxFit.contain,
                          )
                              : Container(),
                          Text(widget.labelText,
                              style: TextStyle(fontSize: Styles.NormalFont,color: Styles.LeftTitleColor,)),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
              Expanded(
                flex: 2,
                child: GroupedCheckbox(
                    itemList: allItemList,
                    checkedItemList: checkedItemList,
                    wrapDirection: widget.wrap,
                    disabled: widget.disabled?allItemList:[],
                    onChanged: (itemList) {
                      setState(() {
                        checkedItemList = itemList;
                        print('SELECTED ITEM LIST $itemList');
                      });
                      List<SelectItems> tem = [];
                      for(var index=0;index<itemList.length;index++){
                        tem.add(widget.items[index]);
                      }
                      widget.selectCallback(tem);
                    },
                    orientation: CheckboxOrientation.WRAP,
                    checkColor: Colors.white,
                    activeColor: Colors.blue),
              )
            ],
          ),
        ),
      ),
    );
  }
}
